<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Web2 Blog</title>
	<link rel="stylesheet" type="text/css" href="../style/main.css" />
	<link rel="stylesheet" type="text/css" href="../style/colorbox.css" />
	<link rel="stylesheet" type="text/css" href="../style/rating.css" />
	<script src="http://www.google.com/jsapi"></script>
	<script type="text/javascript">
		google.load("jquery", "1.7.1");
		google.load("jqueryui", "1.8.16");
	</script>
	<script src="../js/blogHandler.js" type="text/javascript"></script>
	<script src="../js/jquery.colorbox.js" type="text/javascript"></script>
	<script src="../js/google.js" type="text/javascript"></script>
	<script src="../js/comment.js" type="text/javascript"></script>
	<script src="../js/eventHandler_comment.js" type="text/javascript"></script>
</head>
<body>

<div id="wrapper_outer">

	<div id="wrapper">
		
		<p id="back-top">
			<a href="#wrapper"><span></span></a>
		</p>
    
    	<div id="header">
            <div id="site_title">
                <h1>Web2 Blog<span>CS4380 Project</span></h1>
            </div> <!-- end of site_title -->
            
            <div id="menu">
                <ul>
                    <li><a href="../index.html" id="home" class="current">Home</a></li>
                    <li><a href="#create_popup" id="create">Create</a></li>
                    <li><a href="../api.html" id="api" target="_blank">APIs</a></li>
                </ul>
            </div> <!-- end of menu -->
            
		</div>   <!-- end of header -->
    
    
        <div id="main_wrapper">
            <div id="main">
	            	
                <div id="blog_content">

                	<div id="content">
            			<div class='post_meta'>
            				{%block post_meta %}{% endblock %}
            			</div>
            			<div class="post_content">
            				{% block post_content %}{% endblock %}

                			
                			<div id="comment_section">
	                			<h3>Comments</h3>
                				<ol id="comments" class="comments first_level">
                					{% block comments_div %}{% endblock %}
                				</ol>
                			</div>
                			
                			<div id="comment_form">
                				<h3>Leave a Comment</h3>
                				{% block comment_form %}{% endblock %}
                			</div>
            			</div>
                	</div>
                	
                </div> <!-- end of blog_content -->
                
                <div class="cleaner"></div>
	                    	
           </div> <!-- end of main -->
        	       	
        </div> <!-- end of main wrapper -->
    </div> <!-- end of wrapper -->
    
    <div id="footer">
    	
			<p>Copyright &copy; XIE Ting</p>
			<p id="credit">
			<a href="http://www.iwebsitetemplate.com/">Website Template</a> By <a href="http://www.templatemo.com/">Templatemo.com</a>
			</p>              
        
        <div class="cleaner"></div>
    </div>
         
</div>

<!-- use color box JQuery plugin to show the create form -->
<div id="create_wrapper" class="popup_wrapper">
	
	<div id="create_popup" class="window">
		<form id="create_form" class="form" action="">
			<h3>Create a Post</h3>
			<div class="yui3-skin-sam">
			<label for="create_user">Author:</label>
			<input type="text" id="create_user" name="create_user" class="input_field" />
			</div>
			<label for="create_pw">Password:</label>
			<input type="password" id="create_pw" name="create_pw" class="input_field" />
			<label for="create_title">Title:</label>
			<input type="text" id="create_title" name="create_title" class="input_field" />
			<label for="create_content">Content:</label>
			<textarea col="15" rows="30" id="create_content" name="create_content"></textarea>
			<input type="button" id="create_submit" class="submit_btn" value="Submit" />
			<input type="button" id="create_cancel" class="submit_btn" value="Cancel" />
			<img id="create_loading" src="../images/loading.gif" style="display:none;" />
			<span id="create_error" class="error_msg"></span>
		</form>
	</div>
	
</div> <!-- end of create_form -->

</body>
</html>